<template>
	<view class="container">
		<swiper :indicator-dots="true" :autoplay="true" indicator-color="#ccc" indicator-active-color="#007aff"
			:interval="3000" :duration="1000">
			<swiper-item v-for="item in 4" >
				<view class="swiper-item">
					<image :src="'/static/n'+item+'.jpg'" style="width: 100%;" mode=""></image>
				</view>
			</swiper-item>
		</swiper>
		<view class="" style="margin: 15px 0;">
			<uni-notice-bar @click="noteDetail" single="true" :text="note"></uni-notice-bar>
		</view>
		<uni-card title="我的功能" style="margin-top: 10px;">
			<view class="" style="display: flex;flex-wrap: wrap;">
				<view v-for="(item,index) in service" style="margin-bottom: 10px;text-align: center;width: 25%;"
					@click="$toService(item.serviceName)" :key="index">
					<image :src="item.imgUrl" style="height: 50px;width: 50px;" mode=""></image>
					<view class="" style="color: #737373;font-size: 13px;margin-top: 5px;">{{item.serviceName}}</view>
				</view>
			</view>
		</uni-card>
		<uni-card title="代取件" extra="两件">
			<view style="display: flex; align-items: center;">
				<view style="height: 10px; width: 10px; border-radius: 50%; background-color: #4CD964;"></view>
				<view style="font-size: 16px; margin-left: 8px;">袜子</view>
				
			</view>
			<uni-steps :options="list" direction="column" :active="2"></uni-steps>
			<view class="line"></view>
			<uni-steps :options="list" direction="column" :active="1"></uni-steps>
			<view class="line"></view>
		</uni-card>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				note: "【2023-03-07 13:44】深圳市龙岗区南湾街道办事处通知 近日，南湾街道厦村社区恒大国香山花园业委会将一面“为民办事关怀至",
				service: [{
						serviceName: "物业服务",
						imgUrl: "/static/a1.png"
					},
					{
						serviceName: "快件管理",
						imgUrl: "/static/a2.png"
					},
					{
						"serviceName": "友邻社交",
						imgUrl: "/static/a3.png"
					},
					{
						"serviceName": "商业推广",
						imgUrl: "/static/a4.png"
					},
					{
						"serviceName": "车辆管理",
						imgUrl: "/static/a5.png"
					},
					{
						"serviceName": "寄快递",
						imgUrl: "/static/a6.png"
					}
				],
				list: [{
					title: '已发货',
					desc: '2023-03-05 13:55'
				}, {
					title: '已揽件',
					desc: '2023-03-06 13:55'
				}, {
					title: '待收货',
					desc: '2023-03-07 13:55'
				}, ]
			};
		},
		onLoad(item) {

		},
		onReady() {

		},
		onShow() {

		},
		methods: {
			noteDetail() {
				uni.navigateTo({
					url: 'noteDetail/noteDetail',
					success: res => {},
					fail: () => {},
					complete: () => {}
				});
			}
		}
	};
</script>

<style lang="scss">

</style>
